<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<c:url value="/contact" var="contactURL" />

<a href="${contactURL}" class="button-link ui-corner-all ui-state-default" >New Contact</a>
<h2>Contacts</h2>
	




<c:if  test="${!empty contact.contactList}">
	<c:set var="contact" value="${contact}" scope="request"/>
	<jsp:include page="contact_inner_loop.jsp"/>
</c:if>



<% /*
<div class="cmd-tree-item-wrapper ui-corner-all">
	<div class="cmd-tree-item-section cmd-tree-item-label-red">Agency</div>
	<div class="cmd-tree-item-section cmd-tree-item-content">This is a text</div>
	<div class="cmd-tree-item-menu cmd-tree-item-section" >
		
		<a href="#" class="right-border"><span class="ui-icon ui-icon-document ui-corner-all" title="New"></span></a>
		<a href="#" class="right-border"><span class="ui-icon ui-icon-pencil ui-corner-all" title="Edit"></span></a>
		<a href="#" ><span class="ui-icon ui-icon-arrowthick-1-s ui-corner-all" title="Details"></span></a>
	</div>
</div> <br/>

<div class="cmd-tree-item-wrapper ui-corner-all">
	<div class="cmd-tree-item-section cmd-tree-item-label-blue">Rep</div>
	<div class="cmd-tree-item-section cmd-tree-item-content">Firstname, First Name</div>
	<div class="cmd-tree-item-menu cmd-tree-item-section" >
		
		<a href="#" class="right-border"><span class="ui-icon ui-icon-document ui-corner-all" title="New"></span></a>
		<a href="#" class="right-border"><span class="ui-icon ui-icon-pencil ui-corner-all" title="Edit"></span></a>
		<a href="#" ><span class="ui-icon ui-icon-arrowthick-1-s ui-corner-all" title="Details"></span></a>
	</div>
</div> <br/>


<div class="cmd-tree-item-wrapper ui-corner-all">
	<div class="cmd-tree-item-section cmd-tree-item-label-orange">Job</div>
	<div class="cmd-tree-item-section cmd-tree-item-content">Bilblybeep Beeplyboo</div>
	<div class="cmd-tree-item-menu cmd-tree-item-section" >
		
		<a href="#" class="right-border"><span class="ui-icon ui-icon-document ui-corner-all" title="New"></span></a>
		<a href="#" class="right-border"><span class="ui-icon ui-icon-pencil ui-corner-all" title="Edit"></span></a>
		<a href="#" ><span class="ui-icon ui-icon-arrowthick-1-s ui-corner-all" title="Details"></span></a>
	</div>
</div> <br/>


<div class="cmd-tree-item-wrapper ui-corner-all">
	<div class="cmd-tree-item-section cmd-tree-item-label-green">Contact</div>
	<div class="cmd-tree-item-section cmd-tree-item-content">TPrlinkGreeb</div>
	<div class="cmd-tree-item-menu cmd-tree-item-section" >
		
		<a href="#" class="right-border"><span class="ui-icon ui-icon-document ui-corner-all" title="New"></span></a>
		<a href="#" class="right-border"><span class="ui-icon ui-icon-pencil ui-corner-all" title="Edit"></span></a>
		<a href="#" ><span class="ui-icon ui-icon-arrowthick-1-s ui-corner-all" title="Details"></span></a>
	</div>
</div> <br/>
*/ %>
<script>

$(function() {
	$( ".button-link" ).hover(
			function() {  
				$(this).addClass('ui-state-hover');  
			},
			function() { 
				$(this).removeClass('ui-state-hover');
			}
		)
	$('#newContactButton').click(function(){
		  location = index.php;
		}); 
	$( "#dialog" ).dialog();
	$( ".cmd-tree-item-menu a" ).hover(
		function() {  
			$(this).addClass('cmd-hover');  
		},
		function() { 
			$(this).removeClass('cmd-hover');
		}
	)
});

function showDetail(contactId) {
	
	// detail-button${contact.id}
	// ui-icon-arrowthick-1-s
	// ui-icon-arrowthick-1-n
	
	if($("#detail-table-holder" + contactId).data("dwtag") == "off") {
		$("#detail-table-holder" + contactId).data("dwtag","on");
		$("#detail-table-holder" + contactId).show();
		$("#detail-button" + contactId).removeClass("ui-icon-arrowthick-1-s");
		$("#detail-button" + contactId).addClass("ui-icon-arrowthick-1-n");
	} else {
		$("#detail-table-holder" + contactId).data("dwtag","off");
		$("#detail-table-holder" + contactId).hide();
		$("#detail-button" + contactId).removeClass("ui-icon-arrowthick-1-n");
		$("#detail-button" + contactId).addClass("ui-icon-arrowthick-1-s");
	}
	
}

/*
function showDetail(contactId) {
	var downImageURL = '<c:url value="/resources/images/down.png" />';
	var upImageURL = '<c:url value="/resources/images/up.png" />';
	var detailImage = $("#detail-image" + contactId);
	
	if(detailImage.attr('src')==downImageURL) {
		$("#detail-table" + contactId).show();
		detailImage.attr('src', upImageURL);
		
	} else {
		$("#detail-table" + contactId).hide();
		detailImage.attr('src', downImageURL);
	}
}
*/

</script>